<template>
  <div class="page_padding">
    <MyNavBar @goback="goback" title="批示" />
    <div class="approve">
      <!-- <div class="unit-group">
        <p class="unit-tit">
          <span class="text">批示单位</span>
        </p>
        <van-checkbox class="check-all" :disabled="disabledCheck" v-model="checkedAll" name="a" shape="square">
          全选
        </van-checkbox>
        <van-checkbox-group :disabled="disabledCheck" v-model="checkedOrgs" ref="checkboxGroup" direction="horizontal">
          <van-checkbox v-for="(item, index) in orgs" :key="index" :name="item.objId" shape="square">
            {{ item.objName }}
          </van-checkbox>
        </van-checkbox-group>
      </div> -->
      <BoardSound :listData="extraData" :entry="!disabled"></BoardSound>
      <div class="btn-group">
        <van-button round color="#004db6" block @click="setData">提交</van-button>
      </div>
    </div>
  </div>
</template>
<script>
import { instruSave } from '@api/api-task.js'

import BoardSound from '@com/BoardSound'
export default {
  name: 'LeaderApproveAdd',
  components: {
    BoardSound,
  },
  data() {
    return {
      id: this.$route.query.id,
      disabled: false,
      extraData: {
        id: '',
        title: '批示内容',
        entryCont: '',
        audioList: [],
        wordLimit: 300,
      },
      disabledCheck: false, // 只有一个单位禁用选择
      checkedOrgs: [],
      orgs: [], // 任务的主办和协办单位
      formData: {
        instruContent: '',
        instruState: 1,
        taskId: '',
        objInfos: [],
        // checkedOrgs: [],
      },
    }
  },
  computed: {
    checkedAll: {
      get() {
        return this.checkedOrgs.length === this.orgs.length && this.checkedOrgs.length !== 0
      },
      set(val) {
        this.$refs.checkboxGroup.toggleAll(val)
      },
    },
  },
  mounted() {
    this.formData.taskId = this.id
    // this.initdata()
  },
  methods: {
    /* 返回上一页 */
    goback() {
      this.$router.go(-1)
    },
    /* 机构信息 */
    /*  async initdata() {
      const { data = [] } = await listInstruOrg({ taskId: this.id })
      this.orgs = [...data]
      if (data.length === 1) {
        const idArr = [data[0].objId]
        this.checkedOrgs = idArr
        this.disabledCheck = true
      }
    }, */
    setData() {
      this.formData.instruContent = this.extraData.entryCont
      // if (!this.checkedOrgs.length) {
      //   this.$toast.fail('请选择批示单位')
      //   return
      // }
      if (!this.formData.instruContent) {
        this.$toast.fail('请输入批示内容')
        return
      }
      if (this.checkedOrgs.length) {
        const objInfos = []
        this.orgs.forEach(item => {
          if (this.checkedOrgs.includes(item.objId)) {
            objInfos.push({
              objId: item.objId,
              objName: item.objName,
              objType: 2, // 1人员 2机构
            })
          }
        })
        this.formData.objInfos = [...objInfos]
      }
      // console.log(this.formData)
      this.submitData()
    },
    submitData() {
      instruSave({
        ...this.formData,
      }).then(res => {
        const { code = 0 } = res
        if (code === 0) {
          this.$toast.success('批示提交成功')
          this.goback()
        }
      })
    },
  },
}
</script>
<style lang="scss" scoped>
.page_padding {
  background: #f7f7f7;
}
.approve {
  // padding: px2rem(32) px2rem(20);
  .unit-tit {
    font-size: px2rem(30);
    font-weight: 800;
    color: #333;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding-bottom: px2rem(30);
    .text {
      background-image: linear-gradient(#ffffff 50%, #e5d2b4);
    }
  }
  .unit-group {
    padding: px2rem(32) px2rem(20);
    // margin-bottom: px2rem(32);
    background: #fff;
    border-bottom: 1px solid #eee;
    // border-radius: px2rem(20);
    // box-shadow: 0 0 px2rem(20) 0 rgba(4, 0, 0, 0.15);
  }
}
/deep/.van-checkbox-group {
  font-size: $fontSize32;
}
/deep/.van-checkbox--horizontal {
  margin-right: 12px;
  margin-bottom: 12px;
}
/deep/.check-all {
  margin-bottom: 18px;
  font-size: $fontSize32;
}
.entry_sound {
  box-shadow: none;
  border-radius: 0;
}
.btn-group {
  margin: px2rem(30);
}
</style>
